/*
 * @Author: new-wang
 * @Date: 2025-04-08 13:47:14
 * @LastEditors: new-wang
 * @LastEditTime: 2025-08-20 15:30:24
 * @FilePath: \v3bbs\src\stores\config.ts
 * @Description: 配置状态管理
 */
import { defineStore } from "pinia";
import settings from "@/settings";
import { ConfigProvider } from 'ant-design-vue'

// 主题色持久化存储的key
const THEME_COLOR_KEY = 'theme_color'

export const useConfigStore = defineStore('config', {
  state: () => {
    return {
      // 语言
      language: settings.defaultLanguage,
      // 主题色
      theme: settings.defaultTheme,
      // 头部菜单是否折叠
      collapsed: settings.collapsed,
      // 宽度
      width: settings.width,
      // 高度
      height: settings.height,
      // 判断用户是否已经登录
      isLogin: false,
      // 登录modal是否显示
      loginVisible: false,
      // 注册modal是否显示
      registerVisible: false,
      // 用户名称长度限制
      userMaxLength: 10,
      // 主题色
      colorOptions: ["#000000", "#3eaf7c", "#13c2c2", "#1869ff", "#722ed1", "#eb2f96"],
      // 当前使用的主题色
      themeColor: localStorage.getItem(THEME_COLOR_KEY) || settings.defaultThemeColor,
    }
  },
  actions: {
    setTheme(data: string) {
      this.theme = data
      // toggleHtmlClass(data)
    },
    setThemeColor(color: string) {
      if (this.themeColor === color) {
        return;
      }
      this.themeColor = color
      // 持久化存储主题色
      localStorage.setItem(THEME_COLOR_KEY, color)
      // 更新主题色
      ConfigProvider.config({
        theme: {
          primaryColor: color,
        },
      })
      // 触发主题色变化事件
      document.documentElement.style.setProperty('--theme-color', color)
      // 添加过渡动画
      document.documentElement.style.setProperty('--theme-transition', 'all 0.3s ease-in-out')
    },
    setLanguage(lang: string, title: any) {
      // @todo i18n 国际化设置
      // title 预留 i18 page title
      this.language = lang
    }
  }
})
